<template>
  <div class="viewNum">
    <div><img src="static/img/icon_user.png" alt>
    <span>{{pv>10000?(((pv-pv%1000)/10000+'w')):(pv)}}</span></div>
		<img src="static/img/ad.png" alt style="width: 27px;height: 27px;" @click="ad">
    <!-- <img src="static/img/icon_chat.png" alt>
    <span>{{chatNum}}</span> -->
  </div>
</template>

<script>
export default {
  data() {
    return {
      pv: 0,
      chatNum: 0,
    };
  },
	mounted() {
		setTimeout(()=>{
			this.getViewNumber(this.$store.state.liveInfo);
		},500)
		setInterval(() => {
			this.getViewNumber(this.$store.state.liveInfo);
		}, 30000);
	},
  methods: {
		ad(){
			this.$emit("adClick")
		},
    getViewNumber(info) {
      /*观看人数*/
      this.$http
        .get(this.$api.getViewNum(this.$route.params.id))
        .then(res => {
          if (res.data.code == 0) {
            // if (info.viewerSwitch == 1) {
            //   this.pv = info.viewerBastic + res.data.pv * info.viewerTimes;
            // } else {
              this.pv = res.data.pv;
            // }
            this.chatNum = res.data.num;
          }
        });
    },
  }
};
</script>

<style lang="less" rel=stylesheet/less scoped="scoped">
.viewNum {
  display: flex;
  align-items: center;
  justify-content: space-between;
	position: relative;
  height: 100%;
  width: calc(100%- 20px);
  color: #fff;
  background: #000;
  font-size: 14px;
	padding:0 10px;
  img {
    width: 18px;
    height: 18px;
		vertical-align: middle;
  }
}
</style>
